
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE10">
    <meta charset="UTF-8">
    <title></title>
    <link rel="shortcut icon" href="/favicon.ico" />
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <meta name="renderer" content="webkit">
    <link rel="stylesheet" href="/home/css/Dvideo.css"/>
    <link rel="stylesheet" href="/home/css/bootstrap.min.css">
    <link rel="stylesheet" href="/home/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="/home/css/mylogin.css" />
    <link rel="stylesheet" href="/home/css/componet.css" />
    <link rel="stylesheet" href="/home/css/footer.css">
    <link rel="stylesheet" href="/home/css/iconfont.css">
    <link rel="stylesheet" href="/home/css/common.css"/>
    <link rel="stylesheet" href="/home/css/video.css"/>
    <link rel="stylesheet" href="/home/css/task.css"/>
    <link rel="stylesheet" href="/home/css/layer.css"/>
    <link rel="stylesheet" href="/home/css/lib/ckeditor/plugins/codesnippet/lib/highlight/styles/default.css">


    <script src="/home/js/jquery-1.12.1.js" type="text/javascript" charset="utf-8"></script>
    <script src="/home/js/artTemplate.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" src="/home/js/jquery.dotdotdot.js"></script>
    <script type="text/javascript" src="/home/js/bootstrap.js"></script>
    <script src="/home/js/jquery.pagination.js"></script>
    <script src="/home/js/ajax.js" type="text/javascript" charset="utf-8"></script>
    <script src="/home/js/helpers.js"></script>
    <script src="/home/js/lib/ckeditor/plugins/codesnippet/lib/highlight/highlight.pack.js"></script>
    <script src="/home/js/commonJS.js" type="text/javascript"></script>
    <script type="text/javascript" src="/home/js/zhuge.js" charset="utf-8"></script>

</head>
<body>
<input type="hidden" name="_token" value="{{csrf_token()}}">
<div class="videoBody-top">
    <div class="mainLeft">
        <div class="header">
            <a href="javascript:history.go(-1)" id="back" class="backIcon"><img src="/home/img/fanhui.png" /><span class="video_name"></span></a>
            <!--试学显示弹层-->
            <div class="tryBox">
                <span>想获取更多福利、更多体验?</span>
                <button class="ask">立即咨询</button>
                <button class="buy">立即报名</button>
                <i class="iconfont icon-guanbi"></i>
            </div>
        </div>
        <div class="videoBody">
            <div class="videoBody-play"></div>
            <div class="playerLayer"></div>
            <p class="getNextPlay" id="bf5">学习过了</p>
        </div>
    </div>
    <div class="leftWarp">
        <!--<div class="hideList"></div>-->
        <div class="edit_nav">
            <div class="menu_video activeNav" id="bf2" data-md="mulu">
                <img src="/home/img/icon08.png">
                <span>目录</span>
            </div>
            <div class="menu_note" id="bf3" data-md="biji">
                <i class="iconfont icon-biji"></i>
                <span>笔记</span>
            </div>
            <div class="menu_ask" id="bf4" data-md="wenda">
                <i class="iconfont icon-wenda"></i>
                <span>问答</span>
            </div>
        </div>
        <div class="mainRight">
            <div class="menuTitle"></div>
            <div class="videoBody_menuList">
                <!--视频列表-->
                <div class="video_menuList">
                    <div class="menuList_warp"></div>
                </div>
                <!--笔记-->
                <div class="noteWarp" style="display: none;">
                    <div class="texteraWarp">
                        <textarea placeholder="好记性不如烂笔头"></textarea>
                    </div>
                    <p><i class="icon-weijiaojuan iconfont"></i>请输入笔记内容</p>
                    <button>保存</button>
                </div>
                <!--问答-->
                <div class="askWarp" style="display: none;">
                    <div class="titleWarp">
                        <label><i>*</i>标题：</label>
                        <input type="text" placeholder="一句话描述出你的问题（5-50字）" maxlength="50"/>
                        <ul class="sameQues hide"></ul>
                    </div>
                    <div class="content">
                        <label><i>*</i>描述：</label>
                        <textarea></textarea>
                    </div>
                    <p><i class="icon-weijiaojuan iconfont"></i><span></span></p>
                    <button>确定</button>
                </div>
            </div>
        </div>
    </div>

</div>
<div class="videoBody_bottom clearfix">
    <div class="videoBody_bottom_left">
        <div class="bottom_left_title">
            <span data-md="biji" id="bf9" class="act">笔记</span>
            <span data-md="wenda" id="bf10">问答</span>
            <span data-md="ziliao" id="bf11">课程资料</span>
        </div>
        <div class="content_Warp">

            <!--笔记-->
            <div class="note clearfix biji" data-md="biji" style="display: none;">
                <div class="emptyWarp"></div>
                <div class="cot_Warp">
                    <div class="notelist_warp"></div>
                    <div class="pagesWarp">
                        <div class="pages">
                            <div id="Pagination" class="Pagination_warp"></div>
                        </div>
                    </div>
                </div>
            </div>
            <!--问答-->
            <div class="ask_warp wenda" data-md="wenda" style="display: none;">
                <div class="ask_list_warp"></div>
                <div class="pagesWarp"></div>
            </div>
            <!--资料-->
            <div class="ziliao clearfix" data-md="ziliao" style="display: none;">
                <ul class="ziliao_list clearfix"></ul>
            </div>
            <!--试学展示-->
            <div class="free_type">
                <div class="img_default">
                    <img src="/home/img/defult.png"/>
                    <img src="/home/img/defult.png"/>
                    <p>报名后可享受此服务!</p>
                </div>
            </div>
        </div>
    </div>
    <div class="videoBody_bottom_right">
        <p class="box_title">教师团队</p>
        <ul class="teach_list">
        </ul>
    </div>
</div>
<!--视频完成弹窗-->
<div class="layer_warp">
    <div class="pass_part_alert clearfix">
        <p class="close_layer">
            <img src="/home/img/close.png"/>
        </p>
        <img src="/home/img/success.png" class="alyer_icon"/>
        <p class="txt">恭喜学完该任务，<span>5</span>秒以后自动切换到下一个任务</p>
        <p class="next_txt">下节任务:<span></span></p>
        <div class="button">
            <button class="next_part">下一任务</button>
            <button class="once_angin">再学一遍</button>
        </div>
    </div>
</div>
<!--模块完成弹窗-->
<div class="layer_warp2">
    <div class="pass_part_alert part2 clearfix">
        <p class="close_layer">
            <img src="/home/img/close.png"/>
        </p>
        <img src="/home/img/success.png" class="alyer_icon"/>
        <p class="txt txt_t">恭喜你！你已完成本模块最后一个小节的学习。</p>
        <div class="button">
            <button class="next_part">下一模块</button>
            <button class="once_angin">再学一遍</button>
        </div>
    </div>
</div>
<!--课程完成弹窗-->
<div class="layer_warp3">
    <div class="pass_part_alert clearfix">
        <p class="close_layer">
            <img src="/home/img/close.png"/>
        </p>
        <img src="/home/img/success.png" class="alyer_icon part3"/>
        <p class="txt">太棒了！你已经顺利学完了该课程</p>
    </div>
</div>
<!--免费课程完成弹窗-->
<div class="layer_warp4">
    <div class="pass_part_alert clearfix">
        <p class="close_layer">
            <img src="/home/img/close.png"/>
        </p>
        <img src="/home/img/success.png" class="alyer_icon"/>
        <p class="txt">亲爱的小伙伴，试学课程已经结束啦！</p>
        <p class="txt2"><a href=""  class="addHref" target="_blank">想获取更多福利？立即点击领取！</a></p>
        <div class="button">
            <button class="next_part">更多体验</button>
            <button class="next_part mar_none">超值福利</button>
        </div>
    </div>
</div>
<!--删除笔记弹窗-->
<div class="layer_warp5">
    <div class="pass_part_alert part3 clearfix">
        <p class="close_layer">
            <img src="/home/img/close.png"/>
        </p>
        <img src="/home/img/qsIcon.png" class="alyer_icon"/>
        <p class="txt">你确定要删除该笔记?</p>
        <div class="button padT">
            <button class="next_part">确定</button>
            <button class="once_angin">取消</button>
        </div>
    </div>
</div>
<!--课后练习-->
<div class="videoBody_exercises">
    <div class="exercisesModule">
        <div class="exercisesTitle">课后练习</div>
        <div class="exercisesBody timuAndAnswer">
            <ul class="timu"></ul>
        </div>
        <div class="exercisesBottom">
            <button>继续学习</button>
        </div>
    </div>
</div>
<!--小节测试-->
<div class="khlx_box">
    <div class="sectionTest scetionTest_lists"></div>
</div>
</body>
<script src="/home/js/Dvideo.js"></script>
<script src="/home/js/paper/common.js" type="text/javascript"></script>
<script src="/home/js/paper/paperTemp.js" type="text/javascript"></script>
<script src="/home/js/preSchoolTest/sectionTest/sectionTest.js" type="text/javascript"></script>
<script src="/home/js/video.js" type="text/javascript"></script>
<script src="/home/js/layer.js" type="text/javascript"></script>
<script src="/home/js/footer.js" type="text/javascript"></script>
<script>
    //login template
    (function loginTemp(){
        var url = basePathOnline+"/home/js/commTemplate/loginTemp/loginTemp.js";
        var script = document.createElement('script');
        script.setAttribute('src', url);
        // 把script标签加入head，此时调用开始
        $(document.getElementsByTagName('head')[0]).prepend(script);
    })();
//    function initLogin(){
//        RequestService("/online/user/isAlive", "GET", null, function(data) {
//            if(!data.success){
//                $('#login').modal('show');
//                $('.cymylogin-top .cymyloginclose').click(function(){
//                    window.location.href="/"
//                })
//            }else{
//                tools.setCookie('studentId',data.resultObject.id)
//            }
//        })
//    }
//    initLogin();
    //获取课程名字和讲师姓名
//    RequestService("/course/getCourseById", "get", {
//        courserId:tools.getString('courseId')
//    }, function (data) {
//        if(data.success){
//            $.videoTree.menuid = data.resultObject.menu_id;
//            //获取课程类型 埋点需要
//            if(data.resultObject.course_type==0){
//                $.videoTree.course_type='就业课'
//            }else if(data.resultObject.course_type==1){
//                $.videoTree.course_type='微课'
//            }
//            $.videoTree.courseName=data.resultObject.courseName
//        }
//    }, false);
</script>
<script>
    var molId=tools.getString('moduleId');
    var courseId=tools.getString('courseId');
    function get_cc_verification_code(video_id) {
        var verificationcode;
        $.ajax({
            url: '/ccVideo/getCcVerificationCode',
            type: 'get',
            async: false,
            data: {
                type:'D', //区分直播
                studentId:tools.getCookie('studentId'),
                videoId:sessionStorage.getItem('videoPlayerId'),
                courseId:courseId,
                moduleId:molId
            },
            success: function(data) {
                if(data.status==200) {
                    verificationcode = data.result.verificationcode;
                } else {
                    if(data.errorMessage == "尚未登录！") {
                        $('#login').modal('show');
                    }
                }
            }
        });
        return verificationcode;
    };
    var a;
    function playnextVideo(){
        $('.video_palyer_li').each(function(){
            var _this=$(this)
            if(_this.attr('data-videoid')==sessionStorage.getItem('videoPlayerId')){
                if(_this.parents('.video_list_warp').nextAll().find('.video').length==0){
                    if(_this.next('li').length==0){
                        $.videoTree.isShow=false;
                        if($.videoTree.isApply==0){ //未报名
                            $('.layer_warp4').show();
                        }else{ //已报名
                            if($.videoTree.nextModuleId!=null){
                                //模块下最后一个视频
                                $('.layer_warp2').show();
                            }else{
                                //课程下最后一个视频
                                $('.layer_warp3').show()
                            }
                        }
                    }else{
                        timer()
                        if(_this.next().attr("data-type")=="sectionTest"){
                            $('.layer_warp .next_txt span').html('小节测试')
                        }else if(_this.next().attr("data-type")=="homework"){
                            $('.layer_warp .next_txt span').html('课后练习')
                        }else{
                            var pointName=_this.next().attr('data-pointName');
                            $('.layer_warp .next_txt span').html(pointName)
                        }
                    }
                }else{
                    if(_this.next('li').length==0){
                        if($.videoTree.isApply==0){
                            if(_this.parents('.video_list_warp').nextAll().find('.menuList[data-type=1]').length==0){
                                $.videoTree.isShow=false;
                                //试学视频结束
                                $('.layer_warp4').show();
                            }else{
                                timer()
                                var nextVideo =_this.parents('.video_list_warp').nextAll().find('.menuList[data-type=1]').find('.video').eq(0);
                                var nextVideoName=nextVideo.attr('data-pointName');
                                $('.layer_warp .next_txt span').html(nextVideoName)
                            }
                        }else{
                            timer()
                            var nextVideo =_this.parents('.video_list_warp').nextAll().find('.menuList[data-type=0]').find('.video').eq(0);
                            var nextVideoName=nextVideo.attr('data-pointName');
                            $('.layer_warp .next_txt span').html(nextVideoName);
                        }
                    }else{
                        timer()
                        if(_this.next().attr("data-type")=="sectionTest"){
                            $('.layer_warp .next_txt span').html('小节测试')
                        }else if(_this.next().attr("data-type")=="homework"){
                            $('.layer_warp .next_txt span').html('课后练习')
                        }else{
                            var pointName=_this.next().attr('data-pointName');
                            $('.layer_warp .next_txt span').html(pointName)
                        }
                    }
                }
            }
        })
    }
    var timeId=[];
    function timer (){
        $('.txt span').html(5)
        $('.layer_warp').show();
        var num=5;
        if(!sessionStorage.getItem('timerId')){
            $.videoTree.timer=setInterval(function(){
                num--
                $('.txt span').html(num)
                if(num==0){
                    var idItems=sessionStorage.getItem('timerId').split(',');
                    for(items in idItems){
                        clearInterval(idItems[items]);
                    }
                    sessionStorage.removeItem('timerId');
                    $('.layer_warp').hide();
                    $.videoTree.isShow==false;
                    var _this;
                    $('.video_palyer_li').each(function(){
                        if($(this).attr('data-videoid')==sessionStorage.getItem('videoPlayerId')){
                            _this =$(this)
                        }
                    })
                    $.checkNext.eachTree(_this);
                    $.videoTree.getTreeList();
                    num=0
                }

            },1000);

        }
        timeId.push($.videoTree.timer);
        sessionStorage.setItem('timerId',timeId.join())
    }
    $('.layer_warp .once_angin').click(function(){
        $.videoPlayer.playView($.checkNext.currSectionId,$.checkNext.currPointId,$.videoTree.currVideo);
        $('.layer_warp').hide();
        var idItems=sessionStorage.getItem('timerId').split(',');
        for(items in idItems){
            clearInterval(idItems[items]);
        }
        sessionStorage.removeItem('timerId');
    })
    $('.layer_warp .close_layer').click(function(){
        $('.layer_warp').hide();
        var idItems=sessionStorage.getItem('timerId').split(',');
        for(items in idItems){
            clearInterval(idItems[items]);
        }
        sessionStorage.removeItem('timerId');
    })
    $('.layer_warp .next_part').click(function(){
        var _this;
        var idItems=sessionStorage.getItem('timerId').split(',');
        for(items in idItems){
            clearInterval(idItems[items]);
        }
        sessionStorage.removeItem('timerId');
        $('.layer_warp').hide();
        $('.video_palyer_li').each(function(){
            if($(this).attr('data-videoid')==sessionStorage.getItem('videoPlayerId')){
                _this =$(this)
            }
        })
        $.checkNext.eachTree(_this);
    })

    //视频开始播放 更新视频状态
    function on_spark_player_start(video_id) {
        RequestService("/coursePlay/updateVideoStatus", "get", {
            studentId:tools.getCookie('studentId'),
            studyStatus: 1,
            courseId:tools.getString('courseId'),
            sectionId:sessionStorage.getItem('videoSectionId'),
            videoId: sessionStorage.getItem('videoPlayerId')
        }, function(data) {
            if(data.status==200){
                $(".getNextPlay").show();
                $.videoTree.getTreeList();
            }
        });
    }
    //已学习
    $('.getNextPlay').click(function(){
        RequestService("/coursePlay/updateVideoStatus", "get", {
            studentId:tools.getCookie('studentId'),
            studyStatus:2,
            courseId:tools.getString('courseId'),
            sectionId:sessionStorage.getItem('videoSectionId'),
            videoId: sessionStorage.getItem('videoPlayerId')
        }, function(data) {
            if(data.status==200){
                playnextVideo();
                setTimeout(function(){
                    $.videoTree.getTreeList();
                },30)
                zhuge.track('Web_点击学习过了')
            }else if(data.status==401){
                $('#login').modal('show');
            }else{
                tools.comPop('操作失败~')
            }
        });
    })
    function get_custom_id() {
        // 用户获取待设置的自定义参数的逻辑
        var custom_id = 'D_'+$.videoTree.studentCourseId+'_'+sessionStorage.getItem('videoPlayerId');
        return custom_id;
    }
    //视频播放完成 更新视频状态
    function on_spark_player_stop(video_id) {
        RequestService("/coursePlay/updateVideoStatus", "get", {
            studentId:tools.getCookie('studentId'),
            studyStatus:2,
            courseId:tools.getString('courseId'),
            sectionId:sessionStorage.getItem('videoSectionId'),
            videoId: sessionStorage.getItem('videoPlayerId')
        }, function(data) {
            if(data.status==200){
                $(".getNextPlay").hide();
                playnextVideo()
            }else if(data.status==401){
                $('#login').modal('show');
            }else{
                tools.comPop('操作失败~')
            }
        });
    }
    $(document).ready(function(){
        zhuge.track('Web_进入课程播放页')
    });
</script>
</html>